import BaseView from "../baseView.js";

let that = {};
export default class adminsUpdate extends BaseView {
  //修改构造函数
  constructor(id, adminsId) {
    super(id);
    //获得传过来的参数的值 并赋值给详情页面的属性this.studentId赋值
    this.adminsId = adminsId;
    //console.log("详细信息页面：adminsId==>>"+adminsId);
    //挂载数据
    this.mouted()
    // 修改this的指向
    that = this;
  }

  //挂载数据
  mouted() {
    console.log("11111", this);
    //console.log("详细页面需要查询：="+this.studentId)
    //发送ajax
    $.ajax({
      type: "get",
      url: "/admins/xiangqing/" + this.adminsId,
      DataType: "json",
      success: (data) => {
        console.log(data);
        if (data.code == 1) {
          let res = data.msg;
          $("#movieId").val(res.adminName);
          $("#cinemasId").val(res.adminPassword);
          //渲染页面
          // myform.render();

          // 获取照片的路径
          $('#demo1').attr('src', `../../images/${res.photo}`);
        } else {
          alert(data.msg)
        }
      }
    })
  }
  render() {
    $("#Content").html(`
             <div>
             <div style="margin: 30px 10px 0 20px ">
             <span class="layui-breadcrumb" style="visibility: visible;">
                 <a>学生管理系统/</a>/
                 <a>学生资料管理/</a>/
                 <a>详细信息</a>
              </span>
              <hr/>
             </div>
             <div>
             <form class="layui-form" id = "addGoodsForm">


        <!-- 上传图片 -->
        <div class="layui-upload">
        <button type="button" class="layui-btn" id="test1">上传图片</button>
        <div class="layui-upload-list" style="width:100px;height:100px;border:1px #ccc solid">
          <img class="layui-upload-img" id="demo1"  style="width:100px;height:100px;">
          <p id="demoText"></p>
        </div>
        </div>  


         <div class="layui-form-item">
         <label class="layui-form-label">管理员账号:</label>
           <div class="layui-input-block">
             <input type="text" id="movieId" required   placeholder="请输入注册账号"  class="layui-input">
           </div>
         </div>
         <div class="layui-form-item">
         <label class="layui-form-label">管理员密码:</label>
           <div class="layui-input-block">
             <input type="text" id="cinemasId" required   placeholder="请输入管理员"  class="layui-input">
           </div>
         </div>

         
         </div>
         </div>
         <div class="layui-form-item">
           <div class="layui-input-block">
             <button type="reset" class="layui-btn layui-btn-primary" id="update">修改</button>
             <button type="reset" class="layui-btn layui-btn-primary" id="back">返回</button>
           </div>
         </div>
       </form>
             </div>
             
             </div>
            `)
  }
  handle() {
    $("#addLayuijs").html(`
      <script>
        layui.use('form', function(){
        var form = layui.form;
         //重新渲染表单
         form.render();
        });
      </script>
    `)


    // 发送数据回后台
    layui.use(['upload', 'element', 'layer'], function () {
      var $ = layui.jquery,
        upload = layui.upload,
        element = layui.element,
        layer = layui.layer;

      //常规使用 - 普通图片上传
      var uploadInst = upload.render({
        elem: '#test1',
        url: '/admins/update' //此处用的是第三方的 http 请求演示，实际使用时改成您自己的上传接口即可。
          ,
        auto: false //不自动上传
          ,
        bindAction: "#update" //绑定一个按钮来触发上传
          // 传入的其他的参数（除了文件以后的参数）
          ,
        data: {
          "_id": that.adminsId,
          // this.adminsId,
          adminName: () => $("#movieId").val(),
          adminPassword: () => $("#cinemasId").val(),
        },
        choose: function (obj) {
          //预读本地文件示例，不支持ie8
          obj.preview(function (index, file, result) {
            $('#demo1').attr('src', result); //图片链接（base64）
          });
        },
        done: function (res) {
          //如果上传失败
          if (res.code > 0) {
            return layer.msg('上传失败');
          }
          //上传成功的一些操作
          //……
          alert("上传成功");
          window.location.hash = "#/main/adminsList";
          $('#demoText').html(''); //置空上传失败的状态
        },
        error: function () {
          //演示失败状态，并实现重传
          var demoText = $('#demoText');
          demoText.html('<span style="color: #FF5722;">上传失败</span> <a class="layui-btn layui-btn-xs demo-reload">重试</a>');
          demoText.find('.demo-reload').on('click', function () {
            uploadInst.upload();
          });
        }
      });
    });

    //返回列表
    $("#back").click(() => {
      window.location.hash = "#/main/adminsList";
    });
  }
}